<template>
	<div>
		<u-popup class="del" v-model="show" mode="bottom" border-radius="30" :closeable="true" close-icon-pos="top-left" close-icon="arrow-down" :safe-area-inset-bottom="true" @close="cancel">
			<div class="mask flex" v-show="delLoading"><u-loading class="del-loading" size="90" color="#999"></u-loading></div>
			<div class="title">删除<span class="del-submit" @click="delSubmit">确定</span></div>
			<div class="content" v-if="row">
				<div class="row flex">自动过滤类似信息：<u-switch v-model="delParams.filter_similar" size="32"></u-switch></div>
				<u-radio-group v-model="delParams.type" size="30" :wrap="true">
					<u-radio v-for="(item, index) in types" :key="index" :name="item.name"><span class="radio-text">{{item.title}}</span></u-radio>
				</u-radio-group>
				<div class="tip">过滤仅支持全局过滤，排除可支持专题或全局排除。</div>
				<div class="check-box">
					<div><u-checkbox v-model="delParams.domain" size="30"><span class="label">域名：</span>{{row.gather_site_domain}}</u-checkbox></div>
					<div><u-checkbox v-model="delParams.channel" size="30"><span class="label">频道：</span>{{row.channel || row.gather_site_name}}</u-checkbox></div>
					<div><u-checkbox v-model="delParams.author" size="30"><span class="label">作者：</span>{{row.name}}</u-checkbox></div>
				</div>
				<div class="subject">
					<u-loading :show="subjectLoading" class="loading"></u-loading>
					<u-checkbox-group @change="subjectChange" :wrap="true" size="30">
						<u-checkbox v-model="item.checked" v-for="(item, index) in delSubject" :key="index" :name="item.id"><span class="label">{{item.title}}</span></u-checkbox>
					</u-checkbox-group>
				</div>
				<u-radio-group v-model="delParams.operate" size="30" v-if="delParams.domain || delParams.channel || delParams.author">
					<u-radio name="filter" :disabled="!!delParams.subject_ids.length?true:false"><span class="radio-text">过滤以上信息</span></u-radio>
					<u-radio name="exclude"><span class="radio-text">排除以上信息</span></u-radio>
				</u-radio-group>
			</div>
		</u-popup>
		<u-toast ref="uToast" />
	</div>
</template>

<script>
import { subjectIncluded, articleDel } from "@/api/subject.js";
export default {
	props: {
		row: {
			type: Object,
			default: {}
		},
		isDel: {
			type: Boolean,
			default: false,
		},
	},
	data() {
		return {
			types: [
				{
					name: 1,
					title: "仅删除本条信息",
				},
				{
					name: 2,
					title: "删除全部相似信息",
				},
				{
					name: 3,
					title: "删除本专题相似信息",
				}
			],
			delParams: {
				ids: [],
				filter_similar: true,
				type: 1,
				domain: false,
				channel: false,
				author: false,
				subject_ids: [],
			},
			delSubject: [],
			subjectLoading: false,
			delLoading: false,
		};
	},
	computed: {
		show: {
			get() {
				if(this.isDel && !this.delSubject.length) this.getSubject();
				return this.isDel;
			},
			set(value) {
				this.$parent.isDel = value;
			}
		},
	},
	methods: {
		getSubject() {
			this.subjectLoading = true;
			subjectIncluded({l_id: this.row.l_id}).then(({code,data})=>{
				this.subjectLoading = false;
				if(code == 200){
					this.delSubject = data.map(item=>{
						return{
							...item,
							checked: false
						}
					})
				}
			});
		},
		delSubmit() {
			let params = {...this.delParams};
			params.filter_similar = params.filter_similar?"t":"f";
			params.domain = params.domain?"t":"f";
			params.channel = params.channel?"t":"f";
			params.author = params.author?"t":"f";
			params.ids = [this.row.id];
			this.delLoading = true;
			articleDel(params).then(({code})=>{
				this.delLoading = false;
				if(code == 200){
					this.$refs.uToast.show({
						title: "删除成功",
						type: "success",
						callback: ()=>{
							this.cancel();
							this.$store.commit("isRefreshAllListHandle", new Date().getTime());
						}
					});
					
				}
			});
		},
		subjectChange(e) {
			this.delParams.subject_ids = e;
			if(!!e.length) this.delParams.operate = "exclude";
		},
		cancel() {
			this.$emit("close");
		},
	}
}
</script>

<style lang="scss">
.del{
	.mask{
		position: absolute;
		z-index: 100;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background-color: rgba(255, 255, 255, 0.3);
		justify-content: center;
		align-items: center;
	}
	.title{
		margin-top: 10rpx;
		text-align: center;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 32rpx;
		font-weight: bold;
		position: relative;
		z-index: 1;
		border-bottom: 2rpx solid #eee;
		
		.del-submit{
			position: absolute;
			z-index: 1;
			right: 40rpx;
			color: #E60012;
		}
	}
	.content{
		padding: 30rpx;
		.row{
			align-items: center;
			margin-bottom: 20rpx;
		}
		.radio-text{
			font-size: 28rpx;
		}
		.label{
			font-size: 28rpx;
		}
		.check-box{
			margin-bottom: 10rpx;
		}
		.subject{
			border-top: 2rpx solid #eee;
			border-bottom: 2rpx solid #eee;
			padding: 10rpx 0;
		}
	}
	.tip{
		font-size: 24rpx;
		color: #639cf2;
		background-color: #EDF3FD;
		padding: 8rpx;
	}
}
</style>